<template>
  <view>
<!--    <cu-custom
      :bgImage="bgImage"
      topTitle="工作台"
      :needBack="false"
      backIconColor="#ffffff"
      titleClass="commTitle white"
    ></cu-custom> -->
    <view class="content">
      <img src="@/static/images/my/bottom.png" class="top_img" />
    </view>
    <view class="pd32">
      <!-- <view class="message" @click="toMessage">
        <view class="message-num"
          >您有{{ noReadList.length || 0 }}条消息提醒</view
        >
        <image src="@/static/images/home/icon_right.png"></image>
      </view> -->
      <view class="btns">
        <view class="btn-1 wdsb" @click="goMyDeclare" v-if="userRoleKey == 'APPLICANT'">
          <view class="name">我的申报</view>
          <view class="right-icon">
            <image src="@/static/images/my/right_1.png"></image>
          </view>
        </view>
        <view class="btn-1 sbcl" @click="goApplicationMaterials" v-if="['AUDIT_EXPERT', 'GUIDANCE_EXPERT', 'EXPERT', 'admin'].includes(userRoleKey)">
          <view class="name">申报材料</view>
          <view class="right-icon">
            <image src="@/static/images/my/right_2.png"></image>
          </view>
        </view>
        <view class="btn-1 xxtz" @click="goMessage" v-if="userRoleKey == 'APPLICANT'">
          <view class="name">消息通知</view>
          <view class="right-icon">
            <image src="@/static/images/my/right_3.png"></image>
          </view>
        </view>
				<view class="btn-1 zjgl" @click="toExpertManager"  v-if="userRoleKey == 'admin'">
				  <view class="name">专家管理</view>
				  <view class="right-icon">
				    <image src="@/static/images/my/right_4.png"></image>
				  </view>
				</view>
      </view>
    </view>
  </view>
</template>

<script>
import { getNoReadMessageList } from "@/api/workBench";
export default {
  data() {
    return {
      noReadList: [],
			userRoleKey: 'APPLICANT'
    };
  },
  methods: {
		initData() {
			console.log('initData===');
			let userInfo = uni.getStorageSync("userInfo");
			if (userInfo.roles && userInfo.roles.length > 0) {
				this.userRoleKey = userInfo.roles[0].roleKey;
			}
			this.getNoReadMessageList();
		},
    getNoReadMessageList() {
      getNoReadMessageList({
        isRead: 0,
      }).then((res) => {
        if (res.code == 200) {
          this.noReadList = res.data;
          console.log(this.noReadList);
        } else {
          uni.showToast({ title: res.msg, icon: "none" });
        }
      });
    },
    goApplicationMaterials() {
      uni.navigateTo({
        url: `/packageB/applicationMaterials/index`,
      });
    },
    goMyDeclare() {
      uni.navigateTo({
        url: `/packageB/myDeclare/index`,
      });
    },
    goMessage() {
      uni.navigateTo({
        url: `/packageB/messageNotification/index`,
      });
    },
    toMessage() {
      uni.navigateTo({
        url: `/packageB/noReadMessageList/index`,
      });
    },
		// 专家管理
		toExpertManager() {
			uni.navigateTo({
			  url: '/packageB/expertManager/index',
			})
		},
  },
};
</script>

<style lang="scss" scoped>
.pd32 {
  padding: 0 32rpx;
}

.content {
  position: relative;
  width: 100%;
  height: 343rpx;
  background: #ffffff;

  .top_img {
    width: 750rpx;
    height: 343rpx;
  }
}

.message {
  width: 100%;
  height: 74rpx;
  background: #fef7da;
  border-radius: 37rpx;
  margin-top: 24rpx;
  padding: 0 36rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;

  .message-num {
    padding-left: 48rpx;
    background: url("@/static/images/home/icon_message.png") left center
      no-repeat;
    background-size: 32rpx 32rpx;
    color: #e8b042;
  }

  image {
    width: 15rpx;
    height: 28rpx;
  }
}
.btns {
  .btn-1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 152rpx;
    border-radius: 12rpx;
    padding: 0 50rpx;
    margin-top: 30rpx;
    .name {
      font-size: 30rpx;
      font-weight: 800;
      color: #194b3c;
      padding-left: 110rpx;
      height: 152rpx;
      line-height: 152rpx;
    }
    &.wdsb {
      background-color: #eafffa;
      .name {
        background: url("@/static/images/my/wdsb.png") no-repeat left center;
        background-size: 68rpx 68rpx;
      }
    }
    &.sbcl {
      background-color: #e5f6fe;
      .name {
        background: url("@/static/images/my/sbcl.png") no-repeat left center;
        background-size: 68rpx 68rpx;
      }
    }
    &.xxtz {
      background-color: #fefaef;
      .name {
        background: url("@/static/images/my/xxtz.png") no-repeat left center;
        background-size: 68rpx 68rpx;
      }
    }
		&.zjgl {
		  background-color: #edf3ff;
		  .name {
		    background: url("@/static/images/my/zjgl.png") no-repeat left center;
		    background-size: 62rpx 62rpx;
		  }
		}
    .right-icon {
      image {
        width: 45rpx;
        height: 45rpx;
      }
    }
  }
}
</style>
